Sử dụng javascript làm game lật hình up giống nhau
11.076 lượt xem;
- FlipFlop.html
- project /
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8" />
5 <title>Flip-Flop</title>
6 <link type="text/css" rel="stylesheet" href="Styles/GameStyles.css" />
7 <script src='https://kit.fontawesome.com/a076d05399.js'></script>
8 <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">-->
9
10 </head>
11 <body>
12 <h1 class="game-title">Flip-Flop</h1>
13 <div class="overlay-text visible">
14 Click to Start
15 </div>
16 <div id="gameOverText" class="overlay-text">
17 GAME OVER!
18 <span class="overlay-text-small">Click to Restart</span>
19 </div>
20 <div id="winText" class="overlay-text">
21 YOU WIN!
22 <span class="overlay-text-small">Click to Restart</span>
23 </div>
24
25 <div id="gameMainBlock" class="game-container">
26 <div id="gameInfoBlock" class="game-info-block">
27 <div class="game-info">
28 <span id="Timer"></span>
29 </div>
30 <div class="game-info">
31 <span id="Flips"></span>
32 </div>
33 </div>
34
35
36 </div>
37
38 <script type="text/javascript" src="Scripts/Controllers.js"></script>
39 <script type="text/javascript" src="Scripts/FlipFlop.js"></script>
40 </body>
41
42 </html>
2 <html>
3 <head>
4 <meta charset="utf-8" />
5 <title>Flip-Flop</title>
6 <link type="text/css" rel="stylesheet" href="Styles/GameStyles.css" />
7 <script src='https://kit.fontawesome.com/a076d05399.js'></script>
8 <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">-->
9
10 </head>
11 <body>
12 <h1 class="game-title">Flip-Flop</h1>
13 <div class="overlay-text visible">
14 Click to Start
15 </div>
16 <div id="gameOverText" class="overlay-text">
17 GAME OVER!
18 <span class="overlay-text-small">Click to Restart</span>
19 </div>
20 <div id="winText" class="overlay-text">
21 YOU WIN!
22 <span class="overlay-text-small">Click to Restart</span>
23 </div>
24
25 <div id="gameMainBlock" class="game-container">
26 <div id="gameInfoBlock" class="game-info-block">
27 <div class="game-info">
28 <span id="Timer"></span>
29 </div>
30 <div class="game-info">
31 <span id="Flips"></span>
32 </div>
33 </div>
34
35
36 </div>
37
38 <script type="text/javascript" src="Scripts/Controllers.js"></script>
39 <script type="text/javascript" src="Scripts/FlipFlop.js"></script>
40 </body>
41
42 </html>